import '../10.25-触底加载/index.css'
let {list}=require('../10.25-触底加载/data.js')
let ul = document.querySelector('ul');
let loadingBox = document.querySelector('.loading');

let current = 1;
let pagesize = 8;
// let list;
let allpage = Math.ceil(list.length / pagesize);
let flag = true;
xuan();
function xuan() {
    let data = list.slice((current - 1) * pagesize, current * pagesize);
    let str = '';
    data.forEach(function (e) {
        str += `
    <li>
        <img src="${e.pic}" alt="">
        <p>${e.name}</p>
        <p>城市：${e.city}</p>
        <p>地址：${e.address}</p>
        <p>价格：${e.price}</p>
        <p>演出时间：${e.showTime}</p>
    <>
    `;
    });
    ul.innerHTML += str;
}
window.onscroll = function () {
    if (current >= allpage) return;
    if (
        document.documentElement.scrollTop +
            document.documentElement.clientHeight >=
        ul.offsetHeight + ul.offsetTop
    ) {
        // 判断开关
        if (flag === false) return;
        flag = false;
        loadingBox.classList.add('active');
        setTimeout(function () {
            current++;
            xuan();
            loadingBox.classList.remove('active');
            flag = true;
        }, 1000);
    }
};
